import Vue from "vue"
import Vuex from "vuex"
import cloneDeep from "lodash/cloneDeep"
import user from "./modules/user"
Vue.use(Vuex)
/**vuex 官网：/https://vuex.vuejs.org/zh/guide/modules.html */
export default new Vuex.Store({
  namespaced: true,//设置独立的命名空间，避免命名冲突
  state: {
    count: 999,
    // 导航条, 布局风格, defalut(白色) / colorful(鲜艳)
    navbarLayoutType: "colorful",
    // 侧边栏, 布局皮肤, default(白色) / dark(黑色)
    sidebarLayoutSkin: "dark",
    // 侧边栏, 折叠状态
    sidebarFold: false,
    // 侧边栏, 菜单
    sidebarMenuList: [],
    sidebarMenuActiveName: "",
    // 内容, 是否需要刷新
    contentIsNeedRefresh: false,
    // 内容, 标签页(默认添加首页)
    contentTabs: [
      {
        ...window.SITE_CONFIG["contentTabDefault"],
        name: "home",
        title: "home",
        cname: "home"
      }
    ],
    contentTabsActiveName: "home"
  },
  getters: {
    currentActiveTab(state) {
      const current = state.contentTabs.filter(t => t.cname === state.contentTabsActiveName)
      return current.length > 0 ? current[0] : null
    },
    //getters只能通过返回函数的形式接收额外参数
    newcountY: state => (tag = "￥") => {
      return state.count + tag
      /**
       * return function (tag) {
          return state.count + tag
        }
       */
    },
    newcount(state) {
      return state.count + "￥"
    }
  },
  modules: {
    user
  },
  mutations: {
    // 重置vuex本地储存状态
    resetStore(state) {
      Object.keys(state).forEach(key => {
        state[key] = cloneDeep(window.SITE_CONFIG["storeState"][key])
      })
    },
    /**你可以向 store.commit 传入额外的参数，即 mutation 的 载荷（payload） */
    changeAccount(state, payload) {
      state.count = state.count + payload.number
    }
  },
  /**Action 提交的是 mutation，而不是直接变更状态。
     Action 可以包含任意异步操作。 
     Actions 支持同样的载荷方式和对象方式进行分发：*/
  actions: {
    changeAccount(context,payload){
      setTimeout(() => {
        context.commit('changeAccount',payload)
      }, 1000)
      
    }
  }
})
